<template>
    <GeneralOperationForm
        :navLists="navLists"
    >
        <template #default>
            <div>
                <Section :list="navLists[0]" />
                <div class="content-box">
                    <div class="content-row-1">
                        <div class="content-row-title-1">福利院:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[6]"
                                :value="formData1.welfare_org_name"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">姓名:</div>
                        <div class="content-row-text-1">{{ formData1.name }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">身份证号:</div>
                        <div class="content-row-text-1">{{ formData1.id_number }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">出生日期:</div>
                        <div class="content-row-text-1">{{ formData1.birthdate }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">性别:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[8]"
                                :value="formData1.gender"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">学历:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[18]"
                                :value="formData1.ethnicity"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">专业:</div>
                        <div class="content-row-text-1">{{ formData1.hukou_address }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">职称:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[19]"
                                :value="formData1.hukou_category"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">岗位性质:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[20]"
                                :value="formData1.health_status"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">职业岗位:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[21]"
                                :value="formData1.disease_types"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">是否法人:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :options="GENERAL_OPTIONS_1"
                                :value="formData1.type"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">联系方式:</div>
                        <div class="content-row-text-1">{{ formData1.address }}</div>
                    </div>
                </div>
                
                <!-- <div class="content-box">
                    <div 
                        v-for="(item, index) in formData1.attachments"
                        :key="`attachments-${index}`"
                        class="content-row-1"
                    >
                        <FormUploadImage 
                            v-model:imageStr="item.attachmentName"
                            :title="item.attachmentTitle"
                            :showButton="false"
                        />
                    </div>
                </div> -->
            </div>
        </template>
        <template #footer>
            <!-- <el-button 
                type="primary"
                @click="print"
            >
                打印
            </el-button>
            <el-button 
                type="primary"
                @click="goDialogEdit"
            >
                修改
            </el-button> -->
        </template>
    </GeneralOperationForm>
</template>
  
<script lang="ts" setup>
    import { ref, reactive, markRaw, onBeforeMount, onMounted, onBeforeUnmount, nextTick, computed, watch } from 'vue'
    import type { Ref, Raw } from 'vue'
    import { useRoute, useRouter } from 'vue-router'
    import { storeToRefs } from 'pinia'
    import { useStore } from '@/store'
    import { ElMessage } from 'element-plus'
    import {
        Lock,
        User,
        Monitor,
        Phone,
        UploadFilled,
        View
    } from '@element-plus/icons-vue'
    import { 
        welfareorgsGetWelfareOrgsInfoApi, 
    } from '@/apis'
    import { getGeneralOptionsLabel } from '@/utils'
    import { GENERAL_OPTIONS_1, GENERAL_REMOTE_OPTIONS } from '@/constants'

    import GeneralOperationForm from '@/components/generalOperationForm/GeneralOperationForm.vue'
    import Section from '@/components/section/Section.vue'
    import AdministrativeDivisionsCascader from '@/components/administrativeDivisionsCascader/AdministrativeDivisionsCascader.vue'
    import FormUploadImage from '@/components/formUploadImage/FormUploadImage.vue'
    import GeneralSelect from '@/components/generalSelect/GeneralSelect.vue'
    import GeneralOptionValue from '@/components/generalOptionValue/GeneralOptionValue.vue'

    import GeneralTabelList from '@/components/generalTabel/components/generalTabelList/GeneralTabelList.vue'
    import InstitutionalChildListEdit from '@/views/childWelfareInstitutions/institutionalChildList/components/institutionalChildListEdit/InstitutionalChildListEdit.vue'

    

    import {  } from '@/constants'

    const route = useRoute()
    const router = useRouter()
    const store = useStore()
    
    const dialogObj = defineModel<any>('dialogObj', {
        required: false,
        default: {}
    })
    const emits = defineEmits<{
        // (e: 'update:isCollapse', data: boolean): void,
        tabelSearch: [data?: any]
    }>()
    // 侧边栏
    const navLists:Ref<any[]> = ref([
        {
            text: '工作人员基本信息',
            id: 'nav-id-1',
            level: 1,
        },
    ])

    const formData1: Ref<any> = ref({
        welfare_org_name: '',
        name: '',
        id_number: '',
        birthdate: '',
        gender: '',
        ethnicity: '',
        hukou_address: '',
        hukou_category: '',
        health_status: '',
        disease_types: '',
        type: '',
        address: '',

        // attachments: [
        //     {
        //         attachmentName: '', //附件地址名称（多个中间用，分割）	
        //         attachmentTitle: '儿童照片', //附件名称 （例如：身份证正面、身份证反面、学位证书、毕业证书、机构附件）
        //         entitySubType: '', //附件子类型枚举
        //         entitySubTypeName: '', //附件子类型名称
        //         id: '',
        //     },
        //     {
        //         attachmentName: '', //附件地址名称（多个中间用，分割）	
        //         attachmentTitle: '代养协议', //附件名称 （例如：身份证正面、身份证反面、学位证书、毕业证书、机构附件）
        //         entitySubType: '', //附件子类型枚举
        //         entitySubTypeName: '', //附件子类型名称
        //         id: '',
        //     },
        //     {
        //         attachmentName: '', //附件地址名称（多个中间用，分割）	
        //         attachmentTitle: '入院体检报告', //附件名称 （例如：身份证正面、身份证反面、学位证书、毕业证书、机构附件）
        //         entitySubType: '', //附件子类型枚举
        //         entitySubTypeName: '', //附件子类型名称
        //         id: '',
        //     },
        //     {
        //         attachmentName: '', //附件地址名称（多个中间用，分割）	
        //         attachmentTitle: '社会保障卡', //附件名称 （例如：身份证正面、身份证反面、学位证书、毕业证书、机构附件）
        //         entitySubType: '', //附件子类型枚举
        //         entitySubTypeName: '', //附件子类型名称
        //         id: '',
        //     },
        // ], //https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg,https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg
    })
    onMounted(async() => {
        // if (dialogObj.value?.dialogParams.id) {
            try {
                let res1: any = await welfareorgsGetWelfareOrgsInfoApi({
                    id: dialogObj.value.dialogParams?.id ? dialogObj.value.dialogParams?.id : ''
                })
                formData1.value = res1.data
                
            } catch(err) {

            }
        // }
    })

    const print = () => {

    }
    const goDialogEdit = () => {
        dialogObj.value.dialogComponent = InstitutionalChildListEdit
        dialogObj.value.dialogTitle = '修改'
    }

    
</script>
  
<style lang="scss" scoped>
    .content-box {
        @include general-view-1;
        .content-row-1 {
            @include general-view-row-1;
            .content-row-title-1 {
                @include general-view-row-title-1;
            }
            .content-row-text-1 {
                @include general-view-row-text-1;
            }
        }
        .content-row-2 {
            @include general-view-row-2;
            .content-row-title-1 {
                @include general-view-row-title-1;
            }
            .content-row-text-1 {
                @include general-view-row-text-1;
            }
        }
    }
</style>
